<template>
<div class="page-VisualTempPrev">
    <!-- 操作按钮 -->
    <div class="temp-opera-btn-line">
        <div class="opera-line opera-line-l">
            <!-- <a href="javascript:void(0)" class="opera-back" @click='goBack'>&lt;&nbsp;&nbsp;返回</a> -->
        </div>
        <div class="opera-line opera-line-c"></div>
        <div class="opera-line opera-line-r">
            <Button class='gia-btn-has-bd-color temp-btn-item' @click='goBack'>返回</Button>
            <!-- <Button class='temp-btn-item' @click='showPreviewDialog'>预览</Button>
            <Button class='temp-btn-item' @click='saveTheTemp'>保存</Button> -->
            <Button type='primary' class='gia-btn-has-bd-color temp-btn-item' @click='exportTheTempToImg' v-if='briefingDetailId'>导出</Button>
            <Button type='primary' class='gia-btn-blue temp-btn-item' @click='sendTheTempToImg' v-if='briefingDetailId && status'>发布</Button>
        </div>
    </div>
    <!-- 容器-预览 -->
    <CommonTempPage 
        :prevTempFlag='true'
        :templateId='templateId' 
        :briefingDetailId='briefingDetailId' 
        @saveTheTemp='saveTheTemp' 
        @releTheTemp='releTheTemp' 
        ref='CommonTempPage-prev'></CommonTempPage>
</div>
</template>
<script>
import CommonTempPage from '/@/views/visualEditTemp/tempPages/CommonTemp.vue'

export default {
    name: 'VisualTempPrev',
    mounted() {
        // let templateId = C.Utils.data(C.Constant.DK.BRIEFING_DETAIL_TEMPLATEID);
        // let briefingDetailId = C.Utils.data(C.Constant.DK.BRIEFING_DETAIL_ID);
        // console.log('templateId:' + templateId);
        //this.templateId = templateId;
        this.briefingDetailId = 11;//briefingDetailId;
    },
    components: {
        CommonTempPage: CommonTempPage
    },
    data() {
        return {
            // 模板主键
            templateId: '',
            //内容id
            briefingDetailId: '',
            // 预览
            previewDialog: false,
            status: C.Utils.data(C.Constant.DK.BUSINESS_HAS_PUBLISH),
        };
    },
    methods: {
        // 提交-全模板
        releTheTemp() {
            this.$refs['CommonTempPage-prev'].releTheTemp();
        },
        // 保存-全模板
        saveTheTemp() {
            this.$refs['CommonTempPage-prev'].saveTheTemp();
        },
        // 预览-打开
        showPreviewDialog() {
            this.previewDialog = true;
            this.$refs['CommonTempPage-prev'].initTempData();
        },
        // 预览-关闭
        hidePreviewDialog() {
            this.previewDialog = false;
        },
        // 返回
        goBack () {
            this.$router.go(-1);
        },
        // 导出-全模板
        exportTheTempToImg() {
            this.$refs['CommonTempPage-prev'].exportTheTempToImg();
        },
        // 发布-全模板
        sendTheTempToImg() {
            this.$refs['CommonTempPage-prev'].sendTheTempToImg();
        },
    }
};
</script>
<style scoped>
.temp-opera-btn-line{ width: 100%; z-index: 11; padding: 10px 20px; text-align: right; background-color: #FFF; border-bottom: 1px solid #DDD;}
</style>
